<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>视频上传</title>
</head>

<body>
    <form action="uploads1a" id="myform">
        <input type="file" name="image" id="file" />
        <input type="hidden" name="id" id="id" value="{$id}" />
    </form>
    <div id="test"></div>
    <button id="btn">点击上传</button>
    <div>
        <img src="" id="see">
    </div>
    <script type="text/javascript">
            var btn = document.getElementById("btn");
            var file=document.getElementById("file");
            var promise=["mp4"];

            file.onchange=function(){
                var name=file.value;
                var ext=name.substring(name.lastIndexOf(".") + 1).toLowerCase();
                var res=promise.indexOf(ext);
                if (res<0) {
                    alert("文件格式不正确");
                    document.getElementById("btn").disabled=true;
                }else{
                    document.getElementById("btn").disabled=false;
                }
            }
            btn.onclick = function() {
                var val=document.getElementById("file").value;
                if (val.length==0) {
                    return;
                }
                var fromData = new FormData(document.forms[0]);
                fromData.append("test","formdata");
                var oAjax = new XMLHttpRequest();
                oAjax.open('post', "uploadAjax", true);
                oAjax.send(fromData);
                oAjax.onreadystatechange = function() {
                    if (oAjax.readyState == 4) {
                        if (oAjax.status >= 200 && oAjax.status < 300 || oAjax.status == 304) {
                            alert("上传成功！");
                        } else {
                            alert("上传失败！");
                        }
                    }
                };
            }
    </script>
</body>

</html>